import React, { Component } from 'react';
import { Link } from 'react-router';
import { inject, observer } from 'mobx-react';
import { createForm } from 'rc-form';
import Top from 'components/top'
import Ajax from 'lib/Ajax'
import ListMixin from 'mixin/list'

const pageName = 'question';

@inject('appStore', 'languageStore')
@observer
class ModuleName extends ListMixin {
  constructor(props) {
    super(props);
    this.listApi = '/question/list';
    this.state = Object.assign({
      countryId: ""
    }, this.state);
  }

  // componentDidMount(){
  //   this.fetchActivity(1)
  // }

  renderRow = (rowData, sectionID, rowID)=>{
    const { imgBaseUrl, commonData } = this.props.appStore;
    return (
        <div key={rowID} className="text-item">
          <div className="t">{rowData.title}</div>
          <div className="con">
            {rowData.reply}
          </div>
          <p className="p">{rowData.userId}</p>
          <p className="p">{rowData.modifyTime}</p>
        </div>
      );
  }

  render() {
    const pageData = this.props.languageStore.getPageData(pageName);

    const { imgBaseUrl, commonData } = this.props.appStore;
    const countryEn = (commonData.countryEn||[]).map(item => {
      return {
        value: item.code,
        label: item.mean
      }
    });
    const { isLoading, currentPage, pageCount } = this.state;
    return (
      <div className={pageName}>
        <Top
          title={pageData.title}
        />
        <div className={`${pageName}-con`}>
          <div className="filter">
            <Picker data={countryEn} cols={1} value={this.state.countryId} onChange={(value)=>{
                this.doSearch({countryId: value[0]});
                this.setState({
                  countryId: value
                });
              }} className="forss">
              <List.Item arrow="horizontal">请选择国家</List.Item>
            </Picker>
					</div>
          <div className="list">
            <ListView ref="lv"
              dataSource={this.state.dataSource}
              renderFooter={this.renderFooter}
              renderRow={this.renderRow}
              className="fortest"
              pageSize={4}
              scrollRenderAheadDistance={500}
              scrollEventThrottle={20}
              onScroll={() => { console.log('scroll'); }}
              onEndReached={this.onEndReached}
              onEndReachedThreshold={10}
              stickyHeader
            />
          </div>
        </div>
      </div>
    )
  }
}


module.exports = ModuleName
